<style scoped src="./index.scss" lang="scss" rel="stylesheet/scss"></style>
<template src="./index.html"></template>
<script>
export default {
    mixins: [Vue.prototype.$vFN.Mixins.Base],
    components: {
        SlideVerify: async () =>
            Vue.extend(await Vue.prototype.$vFN.Components.Base.SlideVerify()),
    },

    data() {
        return {
            appWindow: window,
            imageKey: "",
        };
    },
    methods: {
        // 提交验证
        async submitVerifyImage(params_) {
            let res = await this.$vFN.Http.post(
                {
                    isToken: false,
                    isSid: false,
                    url: "mall-site-portal/portal-login/login/getCode",
                    data: {
                        degree: params_.rotate,
                        imageKey: this.imageKey,
                        mobile: "15521441999",
                        type: 3,
                    },
                },
                this.appWindow
            );

            if (res._ok) {
                this.$vFN.Tools.messageSuccess("验证码已发送");
                this.$refs.SlideVerify.hide({
                    type:'success'
                });
            } else {
                this.getVerifyImage("update");
            }
        },
        // 获取验证码图片
        async getVerifyImage(type) {
            let res = await this.$vFN.Http.post(
                {
                    isToken: false,
                    isSid: false,
                    url: "mall-site-portal/portal-login/login/getImageCode",
                    domain: "APP_MAIN_DOMAIN",
                },
                this.appWindow
            );
            if (res._ok) {
                // 验证标识
                this.imageKey = res.data.imageKey;
                // 打开滑动验证码
                this.$refs.SlideVerify[type]({
                    // 验证图片
                    imageUrl: res.data.imageUri,
                    // 回调触发
                    change: (res) => {
                        this.submitVerifyImage({
                            // 旋转角度
                            rotate: res.rotate,
                        });
                    },
                });
            }
        },
    },
    mounted() {},
    activated() {},
};
</script>